<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <button id="btn">test</button>

    <script>
      function fn1() {
        setTimeout(() => {
          console.log('timeout callback');
        }, 1000);
        // 如果启动定时器后的同步任务需要花的时间超过延迟的时间, 定时器就不能定时执行了
      }

      function fn2() {
        document.getElementById('btn').onclick = function () {
          console.log('dom event callback');
        };
      }

      function fn3() {
        $.get('../test.json', (data) => {
          console.log('ajax callback');
        });
      }

      function fn4() {
        console.log('同步任务');
        for (let index = 0; index < 100000; index++) {}
      }

      // function fn5() {
      //   Promise.resolve(1).then(() => {
      //     console.log('Promise成功的回调');
      //   });
      // }

    
      fn1();
      fn2();
      fn3();
      fn4();
      // fn5();
    </script>
  </body>
</html>
